<template>
  <div class="cain-card-data">
    <div class="cain-card-data-icon">
      <FileFilled />
    </div>
    <div class="cain-card-data-body">
      <h4>1232112321</h4>
      <p>1232131</p>
    </div>
    <div>qwewq</div>
  </div>
</template>

<script lang="ts" setup>
import { FileFilled } from "@ant-design/icons-vue";
</script>

<style lang="scss">
.cain-card-data {
  width: 100%;
  height: 70px;
  display: flex;
  border: 1px #daeaef solid;
  align-items: center;
  .cain-card-data-icon {
    width: 25%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    svg {
      width: 25px;
      height: 25px;
    }
  }
  .cain-card-data-body {
    width: 55%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    h4 {
      font-weight: 700;
    }
  }
}
</style>
